<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>排程编辑</title>
  <link rel=stylesheet href=libs/bootstrap/css/bootstrap.css>
  <link rel=stylesheet href=libs/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css>
  <link rel=stylesheet href=src/css/graph.editor.css>
</head>
<body class="layout">

<div id="editor" data-options="region:'center'"></div>
<!--jQ-->
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="js/jQuery.js"></script>
<script src="libs/qunee-min.js"></script>
<!-- build:js libs/js.js -->
<!--<script src="libs/jquery.min.js"></script>-->
<script src="libs/qunee-module.js"></script>
<script src="libs/bootstrap/js/bootstrap.min.js"></script>
<script src="libs/layout.border.js"></script>
<script src="libs/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js"></script>
<!-- endbuild -->
<!-- build:js libs/graph.editor.js -->
<script src="src/common/CopyPaste.js"></script>
<script src="src/common/i18n.js"></script>
<script src="src/common/DomSupport.js"></script>
<script src="src/common/DragSupport.js"></script>
<script src="src/common/FileSupport.js"></script>
<script src="src/common/JSONSerializer.js"></script>
<script src="src/common/ExportPane.js"></script>
<script src="src/common/Toolbar.js"></script>
<script src="src/common/ToolBox.js"></script>
<script src="src/common/PopupMenu.js"></script>
<script src="src/common/PropertyPane.js"></script>
<script src="src/common/Image-background.js"></script>
<script src="src/common/GridBackground.js"></script>
<script src="src/graph.editor.js"></script>

<!-- endbuild -->
<script>


  Q.name=""

  Q.registerImage('lamp', Q.Shapes.getShape(Q.Consts.SHAPE_CIRCLE, -8, -8, 16, 16));
  var imgs = [] ;

  //需要图片路径，图片名，模型ID

    $('#editor').graphEditor({
      saveService: 'save',
      //回调函数
      callback: function (editor) {
        var graph = editor.graph;
        graph.onclick = function(){
          if(graph.popupmenu){
            graph.popupmenuOld = graph.popupmenu;
            graph.popupmenu = null
          }else{
            graph.popupmenu = graph.popupmenuOld;
          }
        }
        graph.originAtCenter = false;
        // var background = new ImageBackground(graph, {
        //   onload: function () {
        //     // loadDatas();
        //     // graph.moveToCenter();
        //     graph.moveToCenter()
        //     // graph.limitedBounds = background.bounds;
        //     graph.zoomToOverview();
        //   }
        // });

        //背景图片设置项
        // background.image = '../../img/modelImages/WorkSpace.PNG';
        // background=new GridBackground(graph)
        // // graph.styles = {
        // //   //'shadow.color': '#555',
        // //   //'shadow.blur': 2,
        // //   'arrow.to': false,
        // //   'shape.fill.gradient': new Q.Gradient(Q.Consts.GRADIENT_TYPE_RADIAL, [Q.toColor(0x55DDDDDD), Q.toColor(0x55777777), Q.toColor(0x55C0C0C0), Q.toColor(0x55555555)], [0, 0.6, 0.8, 1]),
        // //   'shape.stroke': 0.5,
        // //   'shape.stroke.style': '#000'
        // // }
        var t=JSON.parse(graph.exportJSON(true));
        // console.log(graph.exportJSON(true));

      },

    });





  function restore() {
    var xhr = new XMLHttpRequest();
    xhr.open('post', '/restore', true);
    xhr.onload = function () {
      alert('restore database');
    };
    xhr.onerror = function (e) {
      showInfo('restore error');
    };
    xhr.setRequestHeader('Content-Type', 'application/json');
    xhr.send();
  }

</script>

</body>
</html>
